import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App'
import './index.css'
import About from './pages/About'
import Info from './pages/Info'
import Home from './pages/Home'
import Mine from './pages/Mine'
import History from './pages/History'
import { Routes, Route, NavLink, BrowserRouter } from 'react-router-dom'
import FixedOnlineHelper from './components/common/fixedOnlineHelper'

ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
  <React.StrictMode>
    <FixedOnlineHelper />    
    <BrowserRouter>
        <div 
          style={{
            display: 'flex', 
            justifyContent: 'space-around', 
            fontSize:'20px',
            background: '#fff',
            padding: '10px 0',
            width: '100vw',
            boxShadow: '2px 2px 5px #000a',
            borderBottom: '1px solid #000a',
            zIndex: 10,
          }}>
          <NavLink to={'/'}>首页</NavLink>
          <NavLink to={'/about'}>关于</NavLink>
          <NavLink to={'/info'}>帮助中心</NavLink>
          <NavLink to={'/history'}>检测记录</NavLink>
          <NavLink to={'/mine'}>个人中心</NavLink>
        </div>
        <Routes>
          <Route element={<About/>} path={'/about'} ></Route>
          <Route element={<Info/>} path={'/info'}></Route>
          <Route element={<Mine/>} path={'/mine'}></Route>
          <Route element={<History/>} path={'/history'}></Route>
          <Route element={<Home/>} path={'/'} ></Route>
        </Routes>
    </BrowserRouter>
    <App />
  </React.StrictMode>
)
